<%@ page contentType="text/html; charset=UTF-8"	pageEncoding="UTF-8" %>
<%@ page import="com.yaodian100.core.common.utils.ServerValue" %>

<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c-rt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://java.sun.com/jstl/fmt_rt" prefix="fmt-rt" %>
<%@ taglib uri="/WEB-INF/tld/mallutil.tld" prefix="mu" %>
<%@ taglib uri="/WEB-INF/tld/pageutil.tld" prefix="pu" %>
<%@ taglib uri="/WEB-INF/tld/importTag.tld" prefix="importTag" %>

<c-rt:set var="imgDomain" value="<%=ServerValue.getImgDomain()%>" />
<c-rt:set var="hostName" value="<%=ServerValue.getFrontHostname()%>" />
<c-rt:set var="frontendContextPath" value="<%=ServerValue.getFrontContextPath()%>" />
<c-rt:set var="frontHtmlPath" value="<%=ServerValue.getFrontApachePath()%>" />
<c-rt:set var="serverName" value="<%=request.getServerName()%>" />

<c-rt:set var="shareLinkPath" value="${hostName}${frontendContextPath}/tuangou/product.do?tuangouId=${tuangouId}" />
<c-rt:set var="promoteName" value="${shelfTuangou.promoteName} - " />
<c-rt:set var="happyText" value="《${promoteName}${product.productName}》商品优质，价格便宜，赶快去看看！" />

${pu:listAdd('paramsImageB', product.productId)}
${pu:listAdd('paramsImageB', 'IMGB')} 
${pu:listAdd('paramsImageB', 'N')}
${pu:reqSet('hqlIB', 'from Image where productId=? and type=? and isDelete=? order by showSeq asc,imgFilePath asc ')} 
${pu:reqSet('imagesB', pu:queryByHql(hqlIB, pu:arrayGet('paramsImageB'), null))}

<script src="/js/jquery.lazyload.yaodian100.js"></script>
<!--[if lt IE 7]>
<script type="text/javascript" src="/js/supersleight-min.js"></script>
<![endif]-->

<script type="text/javascript">
	$().ready(function(){
		var pathname =  document.referrer;
		if(pathname.indexOf("activity.do")!=-1){
			$("#navBar1").attr("class","tab-f");
			$("#titlename").text("今日团购：");
		}else{
			$("#navBar1").attr("class","");
		}
		if(pathname.indexOf("history.do")!=-1){
			$("#navBar2").attr("class","tab-f");
			$("#titlename").text("精采回顾：");
		}else{
			$("#navBar2").attr("class","");
		}
		$("#navBar3").attr("class","");
	});
	
	
	
	//商品圖片
	var currentImageAt=0;
	var desc = new Array();
	var img = new Array();
	var index = 0;
	$(function(){
		<c-rt:forEach items="${imagesB}" var="imageB" varStatus="status">
			desc[index] = "${imageB.picDesc}";
			img[index] = "${imageB.imgFilePath}";
			index++;
		</c-rt:forEach>
		$('.pding-slist > a').each(function(i){
			$(this).mouseover(function(){
				$('.pding-slist > a').each(function(){
					$(this).removeClass('pdimg-f');
				});
				$(this).addClass('pdimg-f');
				$('.pdimg-big > img').eq(0).attr("src",img[i]);
				$("#pdimg-txt").text(desc[i]);
			});
		});
		
		$('img').lazyload({
			placeholder:"http://s.yaodian100.com/images/none2.gif"
			,failurelimit:300
		});
		
		var singleImageBlock = $("#singleImg");
		var allImageBlock = $("#allImg");
		$('.pdimg-btn-more').click(function(){
			singleImageBlock.hide();
			allImageBlock.show();
			$(window).trigger("scroll");//讓 lazy load 重新檢查圖片位置並決定要不要載入圖片
		});
		$('.pdimg-btn-close').click(function(){
			singleImageBlock.show();
			allImageBlock.hide();
			$(window).trigger("scroll");//讓 lazy load 重新檢查圖片位置並決定要不要載入圖片
		});
		$('.pdimg-btn-more').trigger('click');
	});
</script>

<!-- content start -->
<div class="content">
	<!-- 商品主檔 -->
	<div class="pd-big">
		<div class="pd-show">
			<h1><span id="titlename"></span>${shelfTuangou.promoteName}</h1>
			<h2><span>商品名称：</span>${product.productName}</h2>
			
			<c-rt:set var="specMajor1" value="${product.specMajors[0]}" />
			<c-rt:forEach items="${product.specMajors}" var="specMajor" varStatus="status">
				<c-rt:if test="${specMajor.isDelete eq 'N' && specMajor.isCover eq 'Y'}"><c-rt:set var="specMajor1" value="${specMajor}" /></c-rt:if>
			</c-rt:forEach>
			<c-rt:set var="img_main" value="${fn:split(specMajor1.imgRmain, ',')}" />
		<c-rt:choose>
		
			<c-rt:when test="${inventoryCount > 0}">
				<a class="pd-img">
				<img src="${imgDomain}${img_main[0]}" id="tuangouImg" title="${product.productName}" width="400" height="530" onError="this.src='${imgDomain}/PImg/blank_r530.gif'" />	
				</a>
			</c-rt:when>
			
			<c-rt:otherwise>
				<div class="pd-img">
					<img class="icon-sale-out" src="/images/tuangou/icon_saleout.png" />
					<img src="${imgDomain}${img_main[0]}" id="tuangouImg" title="${product.productName}" width="400" height="530" onError="this.src='${imgDomain}/PImg/blank_r530.gif'" />
				</div>
			</c-rt:otherwise>
		</c-rt:choose>
		
		<c-rt:choose>
			<c-rt:when test="${fn:indexOf(shelfTuangou.price,'.')!=-1}">
				<c-rt:set var="bPrice" value="${fn:substring(shelfTuangou.price,0,fn:indexOf(shelfTuangou.price,'.'))}" />
				<c-rt:set var="sPrice" value="${fn:substring(shelfTuangou.price,fn:indexOf(shelfTuangou.price,'.'),-1)}" />
			</c-rt:when>
			
			<c-rt:otherwise>
				<c-rt:set var="bPrice" value="${shelfTuangou.price}" />
				<c-rt:set var="sPrice" value=".0" />
			</c-rt:otherwise>
		</c-rt:choose>	
			
			<div class="left-area">
				<div class="price">
					<p>
						￥<em>${bPrice}</em>${sPrice}
				<c-rt:choose>
					<c-rt:when test="${inventoryCount > 0 && surplusTime>=0}">
						<c-rt:if test="${shelfTuangou.salesType=='1'}">
							<a href="${frontendContextPath}/shopping/tuangou/orderBuyTuangou.do?tuangouId=${tuangouId}" target="_blank" class="btn-go wd-2">
								参团
							</a>
						</c-rt:if>
						
						<c-rt:if test="${shelfTuangou.salesType=='2'}">
							<a href="${frontendContextPath}/shopping/orderprize/orderPrize.do?tuangouId=${tuangouId}" target="_blank" class="btn-go wd-2">
								参团
							</a>
						</c-rt:if>
					</c-rt:when>
					
					<c-rt:when test="${inventoryCount <= 0 && surplusTime>=0}">
						<span class="sell-out">抢购一空</span>
					</c-rt:when>
					
					<c-rt:otherwise>
						<span class="sell-out">抢购结束</span>
					</c-rt:otherwise>
				</c-rt:choose>
					</p>
					<span><s>￥${product.listPrice}</s></span>
					<span><b><fmt-rt:formatNumber value="${discount}" pattern="#0.#" />折</b></span>
					<span>￥${product.listPrice-shelfTuangou.price}</span>
				</div>
<c-rt:choose>
	<c-rt:when test="${inventoryCount > 0 && surplusTime>=0}">
				<script>
					var surplusTime=${surplusTime};
					setInterval(updateTime,1000);
					
					function updateTime(){
						var day=surplusTime/(60*60*1000)/24;
						day=Math.floor(day);
						$("#show_day").html(day);
						var hour=surplusTime/(60*60*1000);
						hour=Math.floor(hour);
						var hour2=hour
						hour2=hour-(day*24);
						hour2=Math.floor(hour2);
						if(hour2<10) hour2="0"+hour2
						$("#show_hour").html(hour2);
						var minute=surplusTime/(60*1000);
						minute=minute-(hour*60);
						minute=Math.floor(minute);
						if(minute<10) minute="0"+minute
						$("#show_minute").html(minute);
						var second=surplusTime/1000;
						second=second-(hour*60*60)-(minute*60);
						second=Math.floor(second);
						if(second<10) second="0"+second
						$("#show_second").html(second);
						surplusTime=surplusTime-1000;
					}
				</script>
				<div class="surplus-time">
					<p>剩馀时间</p>
					<em id="show_day"></em>&nbsp;天&nbsp;<em id="show_hour"></em>:<em id="show_minute"></em>:<em id="show_second"></em>
				</div>
				<p class="txt-m txt-rd"><strong>${shelfTuangou.orderQty-shelfTuangou.cancelQty}</strong>人已购买</p>
				<p>數量有限，先到先得</p>
		<c-rt:choose>
			<c-rt:when test="${(shelfTuangou.orderQty-shelfTuangou.cancelQty)>=shelfTuangou.lowestOrderQty}">
				<p><img src="/images/tuangou/okgo.jpg" alt="团购成功" /></p>
				<p>已达到最低团购数量：${shelfTuangou.lowestOrderQty}件</p>
			</c-rt:when>
			
			<c-rt:otherwise>
				<p>尚未达到最低团购数量：${shelfTuangou.lowestOrderQty}件</p>
			</c-rt:otherwise>
		</c-rt:choose>
				
			<c-rt:if test="${product.productType==1 && product.expectShipDate>shelfTuangou.endDate}">
				<p>预计<strong class="txt-rd"><fmt-rt:formatDate value="${product.expectShipDate}" pattern="yyyy-MM-dd" /></strong>出货</p>
			</c-rt:if>
	</c-rt:when>
	
	<c-rt:when test="${inventoryCount <= 0 && surplusTime>=0}">
				<p class="txt-L txt-rd"><strong>${shelfTuangou.orderQty-shelfTuangou.cancelQty}</strong>人已购买</p>
			<c-rt:if test="${product.productType==1 && product.expectShipDate>shelfTuangou.endDate}">
				<p>预计<strong class="txt-rd"><fmt-rt:formatDate value="${product.expectShipDate}" pattern="yyyy-MM-dd" /></strong>出货</p>
			</c-rt:if>
	</c-rt:when>
	
	<c-rt:otherwise>
				<p class="txt-L txt-rd"><strong>${shelfTuangou.orderQty-shelfTuangou.cancelQty}</strong>人已购买</p>
				<p>數量有限，先到先得</p>
	</c-rt:otherwise>
</c-rt:choose>
			</div> 
		</div>
		<img src="/images/none.gif" class="cf-ft" />
	</div>
	<!-- 商品主檔 -->
	
	<!-- 描述start -->
	<div class="pd-content">
		<h3>商品描述</h3>
		<div class="pd-body">
		
<c-rt:if test="${fn:trim(shelfTuangou.prizeDesc)!=''}">
<!-- 團購說明 -->
<pre class="sp-text">${fn:trim(shelfTuangou.prizeDesc)}</pre>
<!-- 團購說明 -->
</c-rt:if>

			<!-- 商品描述开始，同商品页 -->
			<div class="bbs-content">
				${mu:productDescription(product.productId)}
				<p class="to-top"><a href="#"><span class="a-top"></span>TOP</a></p>
				<c-rt:if test="${fn:length(imagesB)>0}">  
				<div class="bbs-sub">
					<p>商品图片</p>
				</div>
				<!-- 圖片展示區 -->
				<div class="showImage">
					<div id="singleImg" class="pdimg-show" style="clear:both;height:auto;overflow:visible;">
						<p class="pdimg-txt" id="pdimg-txt">${imagesB[0].picDesc}</p>
						<div class="pdimg-big">
							<img src="${imgDomain}${imagesB[0].imgFilePath}" alt=""/>
						</div>
						<div class="pding-slist">
							${pu:listAdd('paramsImageS', product.productId) }
							${pu:listAdd('paramsImageS', 'IMGS')}
							${pu:listAdd('paramsImageS', 'N') }
							${pu:reqSet('hqlIS', 'from Image where productId=? and type=? and isDelete=? order by showSeq asc,imgFilePath asc ')}
							${pu:reqSet('imagesS', pu:queryByHql(hqlIS, pu:arrayGet('paramsImageS'), null))}
							<c-rt:forEach items="${imagesS}" var="imageS" varStatus="status">
								<a href="#${status.index }" <c-rt:if test="${status.index==0 }">class="pdimg-f"</c-rt:if>><img src="${imgDomain}${imageS.imgFilePath}" alt="" width="50" height="50"/></a>
							</c-rt:forEach>
						</div>
						<c-rt:if test="${!empty imagesS}">
							<p><a href="javascript:;" class="pdimg-btn-more">展开全部</a></p>
						</c-rt:if>
					</div>
					<div id="allImg" style="display:none">
					<c-rt:forEach items="${imagesB}" var="imageB" varStatus="status">
						<div class="pdimg-show">
							<p class="pdimg-txt">${imageB.picDesc}</p>
							<div class="pdimg-big" style="height:auto">
								<img src="http://s.yaodian100.com/images/none2.gif" original="${imgDomain}${imageB.imgFilePath}" alt=""/>
							</div>
							<p><a href="javascript:;" class="pdimg-btn-close">收合全部</a></p>
						</div>
					</c-rt:forEach>
					</div>
				</div>
		        <!-- 圖片展示區 -->
		        </c-rt:if>
				<p class="to-top"><a href="#"><span class="a-top"></span>TOP</a></p>
				
				<div class="bbs-sub">
					<p>规格参数</p>
				</div>
				${mu:productDetail(product.productId)}
				<p class="to-top"><a href="#"><span class="a-top"></span>TOP</a></p>
			</div>
			<!-- 商品描述结束，同商品页 -->
		</div>
	</div>
	<!-- 描述start -->
</div>
<!-- content end -->

<!-- sidebar start -->
<div class="sdbar">
	<div class="show-box">
		<importTag:static path="${frontHtmlPath}/tuangou/com/tips.html" />
	</div>
	
	<div class="show-box">
		<h4>今日其他团购</h4>
		<ul class="today-more">
		<c-rt:forEach items="${todayTuangouList}" var="todayTuangou" varStatus="status">
			<li ${status.last==true ? 'class="last-one"' : ''}>
				<a href="${frontendContextPath}/tuangou/product.do?tuangouId=${todayTuangou.tuangouId}" target="_blank">
					<c-rt:set var="tuangouIdKey">${todayTuangou.tuangouId}</c-rt:set>
					<img src="${imgDomain}/PImg/${pu:substring(todayTuangou.productId,0,4)}/${todayTuangou.productId}/${todayTuangou.productId}_rm225.jpg" onError="this.src='${imgDomain}/PImg/blank_r225.gif'" title="${todayPrdNameMap[tuangouIdKey]}" width="170" height="225" />
					<em>${todayPrdNameMap[tuangouIdKey]}</em>
					<p>团购价：<b>￥<fmt-rt:formatNumber value="${todayTuangou.price}" pattern="#0.#" /></b>
					<img src="/images/none.gif" class="btn-gotosee" />
				</a>
			</li>
		</c-rt:forEach>
		</ul>
	</div>
	
	<div class="show-box">
		<importTag:static path="${frontHtmlPath}/tuangou/com/faq.html" />
	</div>
</div>